/*
 * @Author: liyongxuan
 * @Date: 2018-1-10 10:37:42
 * @Last Modified by: liyongxuan
 * @Last Modified time: 2018-1-10 10:37:42
 * @description项目管理-拟投资-投票结果组件
 */
<template>
    <div>
        <div class="ca-box ca-p-22 ca-m-t-15">
          <div class="ca-title">
                <h3>投票结果</h3>
                <div align="right">
                    <el-button size="small" type="primary" @click="saveQuasiVoteEntityCheck">保 存</el-button>
                    <el-button size="small" @click="$emit('close')">取 消</el-button>
                </div>
          </div>
          <el-form ref="dataForm" :model="myResultData" :rules="rules1">
              <table class="ca-table ca-m-t-15 ca-tale-th-pad">
                  <tr>
                      <th width="15%">投票人</th>
                      <th width="15%">角色</th>
                      <th width="10%">投票</th>
                      <th width="25%">意见</th>
                      <th width="20%">投票时间</th>
                      <th width="10%">审批</th>
                      <th width="5%" class="p-tb-0">
                          <button @click="addData()" type="button" class="ca-btn ca-btn-round">
                              <i class="fa fa-plus"></i>
                          </button>
                      </th>
                  </tr>
                  <tr v-for="(item,voteIndex) in myResultData.quasiVoteUserEntityList" :key="voteIndex">
                      <td>
                          <el-select :clearable="true" :filterable="true" v-model="item.userId" placeholder="请选择" props="userId">
                              <el-option v-for="(x,ind) in initView.userList" :label="x.userName" :value="x.id" :key="ind"></el-option>
                          </el-select>
                      </td>
                      <td>
                          <el-select v-model="item.voteRole" placeholder="请选择">
                              <el-option v-for="(x,index) in initView.voteRole" :label="x.name" :value="x.id" :key="index">
                              </el-option>
                          </el-select>
                      </td>
                      <td>{{item.userVoteResult|getUserVoteResult}}</td>
                      <td>{{item.opinion||'-'}}</td>
                      <td>{{item.voteDate||'-'}}</td>
                      <td>
                          <el-button type="primary" :disabled="voteDisabled(item.userId)" @click="voteDialog(item,voteIndex)">投票</el-button>
                      </td>
                      <td class="p-tb-0">
                          <button @click="delData(voteIndex)" type="button" class="ca-btn ca-btn-round">
                              <i class="fa fa-times"></i>
                          </button>
                      </td>
                  </tr>
              </table>
          </el-form>
          <el-row class="ca-title ca-m-t-20">
              <el-col :span="24">
                  <h3>会议决议</h3>
                      <el-input type="textarea" :rows="3" placeholder="不超过3000字" :maxlength="3000" v-model="myResultData.remark"></el-input>
              </el-col>
          </el-row>
          <el-row class="ca-m-t-20 ca-title">
              <el-col :span="12">
                  <h3 class="inline-block">相关文档</h3>
                  <csUploadBtn
                        class="inline-block left20"
                        :fileType="fileType"
                        :isShowFileChildType="false"
                        uploadType="all"
                        :getFileUploadedReturnData="getFileUploadedReturnDataFun"
                    ></csUploadBtn>
              </el-col>
          </el-row>
          <div class="ca-file-ul">
            <el-row class="ca-file-row ca-m-t-20" :gutter="20" v-for="(file, index) in fileList" :key="index">
                    <el-col :span="4" class="upload-time">{{$moment(file.uploadTime).format('YYYY-MM-DD')}}</el-col>
                    <el-col :span="1">
                        <tz-icon-file-type class="ca-m-r-5" :fileType="file.fileName"></tz-icon-file-type>
                    </el-col>
                    <el-col :span="8">
                        <div class="ca-text-over-flow-ellipsis ca-pointer"
                            @click="previewFileCheck(file.id, file.fileName)">
                            <span class="ca-font-size-16 ca-pointer">{{file.fileName}}</span>
                        </div>
                    </el-col>
                    <el-col :span="4">
                        <div class="ca-text-over-flow-ellipsis">{{$store.state.user.cnName}}</div>
                    </el-col>
                    <el-col :span="3" class="ca-pull-right ca-align-right">
                        <a class="ca-download ca-m-r-10" @click="downloadFile(file.id)"></a>
                        <el-button class="ca-table-btn" @click="del(index)">
                            <i class="fa fa-times"></i>
                        </el-button>
                    </el-col>
                </el-row>
                <el-row class="color999"  v-if="fileList.length==0">
                    暂无数据
                </el-row>
            </div>
        </div>
        <!-- 投票弹窗 -->
        <el-dialog title="审核" :visible.sync="dialogVoteVisible" width="30%">
          <el-form :model="voteForm" :rules="rules" ref="form1">            
              <el-form-item label="投票" prop="userVoteResult" label-width="60px">
                <el-select v-model="voteForm.userVoteResult" placeholder="请选择活动区域">
                    <el-option v-for="(x,index) in initView.userVoteResult" :label="x.name" :value="x.id" :key="index"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="意见" label-width="60px">
                <el-input v-model="voteForm.opinion" placeholder="不超过3000字" :maxlength="3000" type="textarea" :rows="6"></el-input>
              </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
              <el-button size="small" @click="dialogVoteVisible = false">取 消</el-button>
              <el-button size="small" type="primary" @click="checkForm">确 定</el-button>
          </div>
      </el-dialog>
    </div>
</template>

<script type="text/ecmascript-6">
    import { api } from '../../api';
    import { apiHttp, STATUS_HTTP_SUCCESS } from '__service/csHttp';
    import mined from '__components/file-list/mixin';
    import { addRemind,isNoAuth } from '__service/utils';
    export default {
        mixins: [mined],
        data() {
            return {
                userId: this.$store.state.user.id,//当前用户id
                fileList: [],//上传文件返回的数据
                dialogVoteVisible: false,//投票弹窗flag
                voteForm: {
                    userVoteResult: null,
                    opinion: '',
                    voteIndex: null
                },//投票弹窗form
                myResultData: {
                    'fileIds': [],
                    'id': '',
                    'itemId': this.itemId,
                    'quasiVoteUserEntityList': [],
                    'remark': '',
                    'voteDate': this.$moment(new Date()).format('YYYY-MM-DD'),
                    'voteType': this.type - 0
                },
                rules1: {
                    userId: [{ required: true, message: '请选择投票人', trigger: 'change' }]
                },
                rules: {
                    userVoteResult: [{ required: true, message: '请选择投票', trigger: 'change' }]
                },
                initView: {
                    userList: this.$store.state.user.department.userEntityList,//角色
                    voteRole: [{id: 1,name: '内部'},{id: 2,name: '外部'}],
                    userVoteResult: [{id: 0,name: '未投票'},{id: 1,name: '赞同'},{id: 2,name: '反对'},{id: 3,name: '弃权'},{id: 4,name: '一票通过'},{id: 5,name: '一票否决'}],
                },
            }
        },
        watch: {
        },
        filters: {
            getUserVoteResult(value) {
                let userVoteResult = [{id: 0,name: '未投票'},{id: 1,name: '赞同'},{id: 2,name: '反对'},{id: 3,name: '弃权'},{id: 4,name: '一票通过'},{id: 5,name: '一票否决'}]
                for (let u of userVoteResult) {
                    if (u.id === value) {
                        return u.name
                    }
                }
            }
        },
        props: {
            resultData: {
                type: Object,
                default: function () {
                    return {}
                }
            },
            itemId: {
                type: String,
                default: ''
            },
            type: {
                type: String,
                default: ''
            },
            fileType: {
                type: String,
                default: ''
            }
        },
        mounted() {
        },
        methods: {
            // 投票按钮活性
            voteDisabled(itemUserId) {
                if (this.authorType()) {
                    return false
                } else if (this.userId === '1') {
                    return false
                } else if (this.userId === itemUserId) {
                    return false
                } else {
                    return true
                }
            },
            authorType() {
                if (this.type === '1') {
                    return isNoAuth('拟投资项目-立项-投票控制')
                } else if (this.type === '2') {
                    return isNoAuth('拟投资项目-风控会-投票控制')
                } else if (this.type === '3') {
                    return isNoAuth('拟投资项目-投决会-投票控制')
                }
            },
            //上传文件删除按钮
            del(index) {
                this.$confirm('是否删除?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning'
                }).then(() => {
                    this.fileList.splice(index,1)
                })
            },
            //文件上传成功返回的数据
            getFileUploadedReturnDataFun(arr) {
                arr.map(item => {
                    this.myResultData.fileIds.push(item.id)
                    this.fileList.push(item)
                })
            },
            // 表单验证
            checkForm() {
                this.$refs.form1.validate(valid => {
                    if (valid) {
                        this.save()
                    } else {
                        return false;
                    }
                });
            },
            // 投票按钮保存
            save() {
                this.myResultData.quasiVoteUserEntityList[this.voteForm.voteIndex].userVoteResult = this.voteForm.userVoteResult
                this.myResultData.quasiVoteUserEntityList[this.voteForm.voteIndex].opinion = this.voteForm.opinion
                this.myResultData.quasiVoteUserEntityList[this.voteForm.voteIndex].voteDate = this.$moment(new Date()).format('YYYY-MM-DD')
                this.dialogVoteVisible = false
            },
            // 已经投过票的用户不显示在下拉列表内
            getUserList() {
                let list = this.initView.userList;
                for (let i = 0; i < this.myResultData.quasiVoteUserEntityList.length; i++) {
                    list = list.filter(x => {
                        return this.myResultData.quasiVoteUserEntityList[i].userId !== x.id
                    })
                }
                return list;
            },
            // 投票按钮
            voteDialog(item,voteIndex) {
                this.dialogVoteVisible = true
                this.voteForm = {
                    userVoteResult: item.userVoteResult,
                    opinion: item.opinion,
                    voteIndex: voteIndex
                }
            },
            // 保存投票信息前的投票验证
            saveQuasiVoteEntityCheck() {
                let flag = true
                if (this.myResultData.quasiVoteUserEntityList.length > 0) {
                    this.myResultData.quasiVoteUserEntityList.map(item => {
                        if (item.userId === '') {
                            this.$message({message: '请选择投票人',type: 'error',center: true})
                            flag = false
                            return false
                        }
                    })
                }
                if (flag) {
                    this.saveQuasiVoteEntity()
                }
            },
            // 保存投票信息
            async saveQuasiVoteEntity() {
                const {resCode} = await apiHttp(api.SAVE_QUASI_VOTE_ENTITY,this.myResultData)
                if (resCode === STATUS_HTTP_SUCCESS) {
                    // 添加小红点
                    let query = {
                        dataId: this.itemId || '', // 业务id
                        dataTab: 1, // tab页顺序 head 也为0 新建为'-1'
                        dataType: 1, // 1拟投资项目,2已投资项目,3母基金,4拟设立基金,5已设立基金,6客户,7潜在项目
                    }
                    if (this.type === '1') {
                        query.dataTab = 1
                    } else if (this.type === '2') {
                        query.dataTab = 3
                    } else if (this.type === '3') {
                        query.dataTab = 4
                    }
                    await addRemind(query);
                    // 根据第三方组件来调用 父组件中定义的方法 重新获取小红点
                    this.$root.Dot.$emit('getDotList');
                    this.$emit('close')
                    this.$message({message: '成功',type: 'success',center: true})
                }
            },
            // 加号按钮
            addData() {
                let newData = {
                    userId: '',
                    voteRole: 1,
                    userVoteResult: 0,
                    opinion: '',
                    voteDate: ''
                }
                this.myResultData.quasiVoteUserEntityList.push(Object.assign({}, newData))
            },
            // 删除按钮
            delData(index) {
                this.$confirm('是否删除?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning'
                }).then(() => {
                    this.myResultData.quasiVoteUserEntityList.splice(index, 1);
                })
            },
            // 关闭弹窗
            closeVote() {
                this.dialogVoteVisible = false
            }
        },
        components: {
            'csUploadBtn': require('__components/upload-btn'),
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.ca-tale-th-pad th {
    padding: 0px
}
.color999{
    color:#999;
    padding: 20px
}
.inline-block{
    display: inline-block;
}
.left20{
    margin-left: 20px
}
</style>
